<route lang="json5">
{
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '',
  },
}
</route>

<template>
  <view>
    <rich-text :nodes="description" v-if="status === 'finished'"></rich-text>

    <!-- 骨架屏加载中 -->
    <view class="w-center pt-32rpx" v-if="status === 'loading'">
      <wd-skeleton animation="gradient" :row-col="imageGroup" />
    </view>
    
    <!-- 没有数据 -->
    <wd-status-tip 
      v-if="status === 'finished' && !description" 
      image="content" 
      tip="暂无内容"
    />
  </view>
</template>
  
<script lang="ts" setup>
import { GetPublicInfo } from "@/service/db_index";
import { Main } from "@/service/types";
import { useThemeStore } from "@/store";

// 主题颜色
const { themeConfig } = useThemeStore();
const state = reactive({
  code: '',
});

const imageGroup = [
  { height: '171px' }, 1, { width: '107px' }, 
  [{ width: '93px' }, { width: '32px', marginLeft: '41px' }]
]
const status = ref('normal');
const description = ref('');
/** 获取公共信息配置 */
const getPublicInfo = async () => {
  try {
    status.value = 'loading';
    const res = await GetPublicInfo(state);
    status.value = 'finished';
    const data = res.data || {} as Main.GetPublicInfoConfigPageItem;
    description.value = data.description || '';
  } catch (error) {
    status.value = 'finished';
    console.log(error)
  }
}

onLoad((options) => {
  const { code } = options || {};
  state.code = code;
})

onShow(() => {
  nextTick(() => {
    // 设置页面标题
    switch (state.code) {
      case '1':
        themeConfig.title = '会员协议';
        break;
      case '2':
        themeConfig.title = '隐私政策';
        break;
      case '3':
        themeConfig.title = '注册协议';
        break;
      case '4':
        themeConfig.title = '关于我们';
        break;
      case '5':
        themeConfig.title = '用户协议';
        break;
    }
  })
  getPublicInfo();
})
</script>

<style lang="scss" scoped>
</style>
        